<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ page session="false"%>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Athenaeum : Profile</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<jsp:include page="assets/header.jsp" />

</head>
<body>
	<jsp:include page="assets/navbar-top.jsp" />
	<div class="page-wrap">
		<div class="container-fluid">
			<div class="row row-wrap">
				<div class="col-md-3">
					<a href="<c:url value="/settings/profile"/>"
						class="btn btn-primary"> <i class="fa fa-edit"></i> &nbsp;Edit
						Your Profile
					</a>
					<div class="row vcard-thumbnail">
						<div class="col-md-12">
							<a href="#" class="thumbnail"> <img
								data-src="holder.js/100%x180" alt="...">
							</a>
						</div>
					</div>
					<h1>
						<span class="vcard-fullname">${profile.fullName}</span> <span
							class="vcard-username">${profile.id}</span>
					</h1>
					<%-- <ul class="vcard-details">
						<c:forEach var="workRecord" items="${profile.work}">
							<c:if test="${workRecord.enabled}">
								<c:if test="${not empty workRecord.company}">
									<li class="vcard-detail"><i class="fa fa-group fa-fw"></i>
										${workRecord.company}</li>
								</c:if>
								<c:if test="${not empty workRecord.location}">
									<li class="vcard-detail"><i class="fa fa-map-marker fa-fw"></i>
										${workRecord.location}</li>
								</c:if>
								<c:if test="${not empty workRecord.email}">
									<li class="vcard-detail"><i class="fa fa-envelope-o fa-fw"></i>
										${workRecord.email}</li>
								</c:if>
								<c:if test="${not empty workRecord.url}">
									<li class="vcard-detail"><i class="fa fa-link fa-fw"></i>
										${workRecord.url}</li>
								</c:if>
								<c:if test="${not empty workRecord.startDate}">
									<li class="vcard-detail"><i class="fa fa-clock-o fa-fw"></i>
										Joined on <fmt:formatDate type="date" dateStyle="medium"
											timeStyle="medium" value="${workRecord.startDate}" /></li>
								</c:if>
							</c:if>
						</c:forEach>
					</ul> --%>
				</div>

				<div class="col-md-9">
					<ul class="nav nav-tabs" id="profile-tab">
						<li class="active"><a href="#contributions" data-toggle="tab"><i
								class="fa fa-check-square-o fa-fw"></i> Contributions</a></li>
						<li><a href="#public-activity" data-toggle="tab"><i
								class="fa fa-rss fa-fw"></i> Public Activity</a></li>
						<li><a href="#messages" data-toggle="tab"><i
								class="fa fa-envelope fa-fw"></i> Messages</a></li>
					</ul>

					<div class="tab-content">
						<div class="tab-pane active" id="contributions">
							<div class="row-wrap"></div>
							<div class="row-wrap">
								<div class="panel panel-default">
									<div class="panel-heading">
										<h3 class="panel-title">Popular Projects</h3>
									</div>
									<div class="panel-body">
										<c:forEach var="project" items="${projects}">
											<p>
												<i class="fa fa-pagelines fa-fw"></i> <a
													href="<c:url value="/project/browse/${project.abbr}"/>">${project.title}</a>
												<a href="#" class="pull-right"
													style="text-decoration: none;"><i
													class="fa fa-star-o fa-fw"></i>0</a>
											</p>
										</c:forEach>
									</div>
								</div>
							</div>

							<div class="row-wrap">
								<div class="panel panel-default">
									<div class="panel-heading">
										<h3 class="panel-title">Your Contributions</h3>
									</div>
									<div class="panel-body">
										<c:forEach var="project" items="${projects}">
											<p>
												<i class="fa fa-pagelines fa-fw"></i> <a href="">${project.title}</a>
												<a href="#" class="pull-right"
													style="text-decoration: none;"><i
													class="fa fa-star-o fa-fw"></i>0</a>
											</p>
										</c:forEach>
									</div>
								</div>
							</div>
						</div>
						<div class="tab-pane" id="public-activity">...</div>
						<div class="tab-pane" id="messages">...</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<jsp:include page="assets/footer.jsp" />
</body>
</html>

